<template>
	<div>
        <el-empty v-if="list.length==0" :image-size="100" style="width: 100%;" description="暂无记录" />
		<el-timeline style="width: 100%">
			<el-timeline-item v-for="(item,index) in list" :key="index" color="#409EFF" placement="top">
				<template #default>
					<div class="custom_part">
						<div class="top_part">
							<div class="time_part">{{ item.createTime }}</div>
							<div v-if="item.operationUser==0" class="userAuth">个人用户</div>
                            <div v-if="item.operationUser==1" class="userAuth">{{item.organizationName}}机构</div>
							<div class="active_tag">{{judgeStatus(item.operation)}}</div>
						</div>
						<div class="user_info" v-if="item.operationUser==0">申请老人：{{ item.oldman }}</div>
                        <div class="user_info" v-if="item.operationUser==1">账号：{{ item.organizationLoginName }}</div>
						<div class="sign_part" v-if="item.operation==3">签名
                        <img style="height: 100%;width: 1005;" :src="item.signature" alt="" srcset="">
                        </div>
                        <div v-if="item.operation==2">
                            拒收原因：{{ item.rejectionReason }}
                        </div>
					</div>
				</template>
			</el-timeline-item>
		</el-timeline>
        <div class="page_part">
            <AplidPaginate class="pageinate mt10"
            style="align-self: flex-end;" background v-bind="pageReac" small layout="prev, pager,next" @change="onPageChange" />
        </div>
	</div>
</template>

<script setup lang="ts">
import { ref, reactive, toRefs, onMounted } from 'vue'
import apiMod from '@/apiMod/index'
import AplidPaginate from '@/components/AplidCrud/src/AplidPaginate'

let props = defineProps({
    nowRowData:{
        type:Object,
        default:()=>({})
    }
})

let pageReac = ref({
	current: 1,
	size: 5,
	total: 0,
})
const onPageChange = (data) => {
	pageReac.value = data
	getInitData()
}
const judgeStatus = (status) =>{
    if(status == 0){
        return '发起申请'
    }else if(status ==1){
        return '发送'
    }else if(status == 2){
        return '拒收'
    }else if(status ==3){
        return '确认'
    }
} 
let list = ref([])
const getInitData = () =>{
    let params = {
        idCard:props.nowRowData.idCard,
        creditCode:props.nowRowData.creditCode,
        pageParaPO:pageReac.value,
    }
    apiMod.view_bscApplicationProcess_page(params).then(res=>{
        if(res.code==0) {
           pageReac.value.total = res.data.total
           list.value = res.data.records
        }
    })
}
getInitData()
</script>
<style scoped lang="scss">
.page_part{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.custom_part{
    .top_part{
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        .time_part{
            font-family: "Microsoft YaHei";
            font-weight: 400;
            font-size: 16px;
            text-align: left;
            color: #000;
        }
        .userAuth{
            padding: 2px 10px;
            height: 25px;
            border-radius: 4px;
            background: #FEF9EB;
            font-family: "Microsoft YaHei";
            font-weight: 400;
            font-size: 16px;
            text-align: center;
            color: #ecbb18;
            margin-left: 39px;
        }
        .active_tag{
            height: 31px;
            line-height: 31px;
            border-radius: 4px;
            padding: 0px 6px;
            background: #0052d9;
            font-family: "Microsoft YaHei";
            font-weight: 400;
            font-size: 14px;
            text-align: center;
            color: #fff;
            margin-left: 79px;
        }

    }
    .user_info{
        font-family: "Microsoft YaHei Bold";
        font-weight: 700;
        font-size: 16rpx;
        text-align: left;
        color: #000000e6;
    }
    .sign_part{
        height: 62px;
        width: 72px;
    }
}
</style>
